import 'dart:developer';

import 'package:flutter/material.dart';
import 'package:flutter_sortable_wrap/sortable_wrap.dart';
import 'package:private_journey/States.dart';
import 'package:private_journey/components/LinkItem.dart';
import 'package:private_journey/pages/trending.dart';
import 'package:private_journey/services/DbService.dart';
import 'package:shadcn_flutter/shadcn_flutter.dart' as shadcn;
import 'package:signals/signals_flutter.dart';

class LinkItemContainer extends StatelessWidget {
  void updateFromDeletedData(List<LinkInfo> list) async {
    DbService dbService = DbService();
    var db = await dbService.database;
    for (var item in list) {
      db.rawInsert(
        'insert into my_sites (icon_url, site_name, site_url) values (?, ?, ?)',
        [item.icon, item.text, item.url],
      );
    }
  }

  void deleteFromDb(List<LinkInfo> list) async {
    DbService dbService = DbService();
    var db = await dbService.database;
    db.rawDelete('delete from my_sites');
  }

  @override
  Widget build(BuildContext context) {
    return Flexible(
      child: shadcn.Container(
        alignment: Alignment.topCenter,
        child: SingleChildScrollView(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.stretch,
            children: [
              Watch((context) {
                return SortableWrap(
                  onSorted: (int oldIndex, int newIndex) {
                    linkInfos.value =
                        [...linkInfos.value]
                          ..removeAt(oldIndex)
                          ..insert(newIndex, linkInfos.value[oldIndex]);
                    var id =
                        linkInfos.value.map((e) {
                          return e.id;
                        }).toList();
                    log('data sorted after: $id');
                    deleteFromDb(linkInfos.value);
                    updateFromDeletedData(linkInfos.value);
                  },
                  onSortCancel: (int index) {
                    log('data sorted cancel:');
                    // updateFromDeletedData(linkInfos.value);
                  },
                  onSortStart: (int index) {
                    log('data sorted before:');
                  },
                  spacing: 10,
                  runSpacing: 15,
                  options:
                      SortableWrapOptions()
                        ..draggableFeedbackBuilder = (Widget child) {
                          return Material(
                            elevation: 18.0,
                            shadowColor: Colors.grey,
                            color: Colors.transparent,
                            borderRadius: BorderRadius.zero,
                            child: Card(child: child),
                          );
                        },
                  children:
                      linkInfos.value.map((e) {
                        return LinkItemComponent(e: e);
                      }).toList(),
                );
              }),
            ],
          ),
        ),
      ),
    );
  }
}
